﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- Facebook Pixel Code -->
<script>
  !function(f,b,e,v,n,t,s)
  {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
  n.callMethod.apply(n,arguments):n.queue.push(arguments)};
  if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
  n.queue=[];t=b.createElement(e);t.async=!0;
  t.src=v;s=b.getElementsByTagName(e)[0];
  s.parentNode.insertBefore(t,s)}(window, document,'script',
  'https://connect.facebook.net/en_US/fbevents.js');
  fbq('init', '205095903581751');
  fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
  src="https://www.facebook.com/tr?id=205095903581751&ev=PageView&noscript=1"
/></noscript>
<!-- End Facebook Pixel Code -->
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport" />
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="yes" name="apple-touch-fullscreen" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />
    <meta content="320" name="MobileOptimized" />
    <meta content="telephone=no" name="format-detection" />
    <title>订单查询</title>

    <link href="../Scripts/Mall/css/cart.css" rel="stylesheet" />
    <link href="../Scripts/Mall/css/reset.css" rel="stylesheet" />
    <script src="../Scripts/Mall/jquery.min.js"></script>

    <style type="text/css">
        body {
            background-color: #fff;
        }

        .prompt {
            text-align: center;
            font-size: 14px;
            color: #666;
            margin-top: 20px;
        }

        .flexbox {
            text-align: center;
            margin-top: 20px;
            margin-bottom: 15px;
            padding: 0 16px;
            display: -webkit-flex;
            justify-content: space-between;
        }

        .inquiry_mob {
            height: 46px;
            line-height: 44px;
            padding: 2px;
            text-indent: 10px;
            color: #666;
            font-size: 14px;
            text-align: left;
            width: 60%;
            vertical-align: middle;
            margin-right: 8px;
            border-radius: 4px;
            border: 1px solid #eee;
            -webkit-flex: 1;
        }

        #go {
            width: 44px;
            height: 44px;
            line-height: 44px;
            background-image: url(../images/next.png);
            background-size: 16px 16px;
            background-position: center;
            background-repeat: no-repeat;
            background-color: #ff5a5f;
            border: 0;
            border-radius: 4px;
            vertical-align: middle;
            margin: 0;
        }

        #inquiry_list {
            margin: 16px;
            text-align:left;
        }

        .data_null {
            padding: 16px;
            font-size: 14px;
            background-color: #f6f6f6;
            color: #666;
        }

        .data_sea {
            padding: 10px;
            font-size: 16px;
            background-color: #f6f6f6;
            color: #666;
        }

        li, ol, ul {
            list-style: none;
            color: #666;
            margin-bottom: 5px;
        }
    </style>
   
</head>
<body>
    <div class="g-bd">
        <div class="m-hd" style="background: #fff;">
            <div class="m-topBar">
                <a class="goback" onclick="javascript :history.back(-1)"></a>
                <div style="width: 100%;">
                    <div class="title">訂單查詢</div>
                </div>
            </div>

        </div>

        <div class="prompt">請輸入您下單時填寫的手機號碼即可查詢訂單狀態</div>

       
            <input type="hidden" name="csrfmiddlewaretoken" value="eH0lIdbPWWj6erC1uILwgYfazryia0XnsWPTNsHxGf95o5crapnwQFVvvhn2WunC" />
            <div class="flexbox">
                <input class="inquiry_mob flex" type="text" name="q" placeholder="請輸入手機號碼" required="required" />
                <button id="go" ></button>
            </div>
    </div>

    <div id="inquiry_list" data_time="訂單時間" data_num="訂單編號" data_sea="查看訂單詳情" data_null="暫時沒有訂單信息" >
            

        </div>
        <script type="text/javascript">
        $('#go').click(function(){
            var phone = $('input[name=q]').val(); 

            $('#inquiry_list').empty();
            $.ajax({
                url: "ordersinfo.php",  
                type: "GET",
                //dataType: "json",
                error: function(){  
                    alert('Error ordersinfo.php');  
                },  
                success: function(res){//如果调用php成功 
                    $.each(res,function(index,value){
                        if (value.mobile==phone){
                            var html = '<div class="data_sea">'+
                                           ' <table border="0" cellpadding="0" cellspacing="0" id="data_table">'+
                                                '<tbody>'+
                                                    '<tr>'+
                                                        '<td>'+
                                                            '<ul style="list-style-type: none;">'+
                                                                //'<li>訂單編號：180321053149091805</li>'+
                                                                '<li>貨品：'+value.goodsname+'</li>'+
                                                                '<li>數目：'+value.num+'</li>'+
                                                                '<li>訂單金額：'+value.price+'</li>'+
                                                               ' <li>收件姓名：'+value.name+'</li>'+
                                                                '<li>電話：'+value.mobile+'</li>'+
                                                                '<li>地址：'+value.address+'</li>'+
                                                               //' <li>支付方式：貨到付款</li>'+
                                                               //' <li>訂單狀態：<span style="color: #ff5a5f;">下單成功</span></li>'+
                                                            '</ul>'+
                                                        '</td>'+
                                                   ' </tr>'+
                                                '</tbody>'+
                                            '</table>'+
                                        '</div>';
                            $('#inquiry_list').append(html);

                        } 
                    });
                    
                    
                    
                }
            });
        })
            
        </script>
</body>

</html>
